<template>
  <div>
    <!-- ===============   作业，写一个地图  ==================== -->
    <MBX level1="数据统计" level2="数据报表"></MBX>
    <!-- 主体 -->
    <el-card class="mt16">
      <!-- 
      参数说明：
      data:类别为object,配置图表所需要的数据，通常由columns和rows两个key组成
      settings:图表配置项
      组件名通常为ve-图表类型，例如：<ve-map />代表地图组件,<ve-line>代表拆线组件
     -->
      <ve-map style="width:500px; height:500px; margin: 0 auto;" :settings="settings" :data="charData" :autoresize="true"></ve-map>
    </el-card>
  </div>
</template>

<script>
// import * as echarts from "echarts";
export default {
  // 水球图
  data() {
    return {
      charData: {
        columns: ["位置", "GDP"],
        rows: [
          { 位置: "吉林", GDP: 123 },
          { 位置: "北京", GDP: 1223 },
          { 位置: "上海", GDP: 2123 },
          { 位置: "浙江", GDP: 4123 },
        ],
      },
      settings: {
        position: "china",
        dataType: {
          GDP: "KMB",
        },
      },
    };
  },
};
</script>

<style lang="scss" scoped>
</style>
